* {
  font-size: 12px;
}

.with-the-box {
  // height: calc(100vh - 74px - 44px);
  height: 100vh;
  width: 100%;
  background-color: #F0F2F5;

  // display: flex;
  // justify-content: center;
  .main {
    height: calc(100vh - 74px - 44px);
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .containerClassName {
    width: 1200px;
    height: 620px;
    // top: 50%;
    // margin: auto;
    // margin-top: ;
    background-image: url(../../../assets/icon/background.png);
    background-size: 100% 100%;
    position: relative;
    display: flex;
    justify-content: end;
    align-items: center;
    background-color: blueviolet;

    .tabs {
      height: 500px;
      // position: absolute;
      // top: 50%;
      // margin-top: -250px;
      //  margin-left: ;
      right: 60px;
      border-radius: 4px;
      background-color: #FFFFFF;
      box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.16);
      overflow-y: hidden;

      .ant-tabs-nav-wrap:not([class*='.ant-tabs-nav-wrap-ping']) {
        justify-content: flex-start;
        height: 62px;
      }

      .from {
        width: 320px;
        height: 100px;
        background-color: aqua;
      }
    }

  }

  .language {
    // width: 400px;
    height: 30px;
    position: absolute;
    top: 29px;
    // right: 60px;
    display: flex;
    justify-content: end;
  }

  .outfit {
    margin-bottom: 10px !important;
    top: 206px;
    left: 866px;
    font-family: Segoe UI;
    color: #333333;
    font-weight: 400;
    font-size: 12px;
    font-style: normal;
    text-decoration: none;
    text-align: left;
  }

  .inputbox {
    border-radius: 4px;
    height: 32px;
    border: 1px solid #D0D0D0;
    padding: 0 11px;

    ::placeholder {
      line-height: 32px;
      color: #D0D0D0;
      font-size: 12px;
    }
  }

  .ant-btn {
    width: 320px !important;
    height: 32px !important;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 30px;
    border-radius: 4px;
    // background-color: red !important;

    span {
      font-size: 12px;
    }
  }

  .ant-pro-form-login-container {
    padding-block: 0px;
    height: 310px;
  }

  .text {
    font-family: Segoe UI;
    color: #999999;
    font-size: 12px;
    text-decoration: none;
    text-align: left;
    margin: 0 4px;
    cursor: pointer;
  }

  .footer {
    /* 其他方式登录 */
    width: 72px;
    height: 16px;
    top: 494px;
    left: 987px;
    font-family: Segoe UI;
    color: #999999;
    font-weight: 400;
    font-size: 12px;
    font-style: normal;
    text-decoration: none;
    text-align: left;
    border-top: 1px solid #999;
    padding: 16px 0;
    margin: 30px auto 0;
  }

  .ant-form-item {
    margin-bottom: 14px !important;
  }

  .ant-form-item-control-input-content {


    .ant-btn {
      /* 矩形 241 */
      height: 32px !important;
      padding: 0 4px;
      flex: 0;
      margin-top: 0px;
      border-radius: 4px;

      span {
        font-size: 12px;
        line-height: 32px;
        text-align: center;
        color: #2927FF;
      }
    }

    .antinput {
      border-radius: 4px;
      min-width: 74px !important;
      max-width: 250px !important;
      flex: 0;
      height: 32px;
      border: 1px solid #D0D0D0;
      font-size: 12px;
      color: #D0D0D0;

    }
  }

}

.loginHeader {
  width: 100%;
  height: 74px;
  // position: absolute;
  background-color: slateblue;
  // top: 40px;
}

.loginFooter {
  width: 100%;
  height: 44px;
  background-color: #F0F2F5;
  // background-color: #2927FF;
  display: flex;
  justify-content: center;
  align-items: center;
  // margin-top: calc(100vh - 738px);
}
